//留言板页面
import styles from './msgboard.less';
import { useEffect } from 'react';
import { MsgboardModelState, useDispatch, useSelector } from 'umi';

import Recommend from '@/components/recommend';
import ExampleComment from "@/components/comment"
export default function Msgboard() {
    let dispatch = useDispatch();
    // 左列表
    const { PageInformation ,CommentContent } = useSelector((state: { msgboard: MsgboardModelState }) => state.msgboard);
    useEffect(() => {
        dispatch({
            type: 'msgboard/getPageInformation'
        });
        dispatch({
            type: "msgboard/getCommentContent"
        })
    }, []);
    console.log(PageInformation);

    return (
        <div className={styles.knowledge} >
            {/* 标题 */}
            <div className={styles.header} dangerouslySetInnerHTML={{ __html: PageInformation.html }}></div>
            {/* 内容 */}
            <div className={styles.main}>
                {/* 评论区 */}
                <h2>评论区</h2>
                <div className={styles.comment}>
                    <Recommend textTips="请输入评论内容 (支持 Markdown)" flag={true}/>
                    {
                        CommentContent?CommentContent.map(item=>{
                            return <ExampleComment key={item.id} children={item} />
                        }):null
                    }
                    
                </div>
                {/* 推荐阅读 */}
                <div>

                </div>
            </div>
        </div>
    );
}
